import { View } from '@tarojs/components';
import { Cell, Empty } from '@nutui/nutui-react-taro';
import { ITextWork } from '../..';
import './index.less';
import Taro from '@tarojs/taro';
import { domain } from '@/constant';

interface IProps {
  onTabbarChange: (index: number) => void;
  worksList?: ITextWork[];
}

const copyToClipboard = (text) => {
  Taro.setClipboardData({
    data: text,
    success: () => {
      Taro.showToast({
        title: '复制成功',
        icon: 'success',
        duration: 2000,
      });
    },
    fail: () => {
      Taro.showToast({
        title: '复制失败',
        icon: 'none',
        duration: 2000,
      });
    },
  });
};

export default function Index(props: IProps) {
  const { worksList = [] } = props;

  return (
    <View className="dou-works">
      {worksList.map((item, index) => (
        <Cell key={index}>
          <View className="text-content">
            <View className="text-result">状态：{item.status}</View>
            <View className="text-result" style={{ marginTop: '4px' }}>
              内容：{item.text ? item.text : '--'}
            </View>
            <View className="text-foot">
              <View className="text-time">{item.createTime}</View>
              <View
                className="button"
                onClick={() => copyToClipboard(item.text)}>
                复制
              </View>
            </View>
          </View>
        </Cell>
      ))}
      {worksList.length === 0 && (
        <Empty
          image={<img src={`${domain}/images/empty.png`} alt="" />}
          title="暂无作品"
          description="快去创作你的专属作品～"></Empty>
      )}
    </View>
  );
}
